<template>
  <div>
    <mt-swipe  class="goodsDetail-swiper">
      <mt-swipe-item v-for="item in ['1','2']" :key="item">
        <img :src="'img1.png' | imagePath" />
      </mt-swipe-item>
    </mt-swipe>
    <div class="goodsDetail-info">
      <h1>雅迪电动车48v12A锂电新国标电动自行车轻驰锂电小型电瓶车踏板</h1>
      <div class="goodsDetail-info-price">
        <strong><em>￥</em>1888.00</strong>
        <del>￥999.00</del>
      </div>
      <p class="goodsDetail-info-spec">商品规格: 蓝色、粉色、白色、黑色</p>
    </div>
    <div class="goodsDetail-detail">
      <div class="goodsDetail-detail-title">图文详情</div>
      <div></div>
    </div>
    <div class="goodsDetail-btn"><span>编辑信息</span></div>
  </div>
</template>

<script>
  export default{
    data(){
      return{}
    }
  }
</script>

<style>
  .goodsDetail-swiper{
    border-radius: 0.13rem;
    height: 10rem;
    background-color: #FFFFFF;
    width: 100%;
  }
  .goodsDetail-swiper .mint-swipe-item{
   border-radius: 0.13rem;
   width: 100%;
   height: 10rem;
   padding: 0;
  }
  .goodsDetail-swiper .mint-swipe-item img{
    display: block;
    width: 10rem;
    height: 10rem;
  }
  .goodsDetail-info{
    background-color: #FFFFFF;
    padding: 0.4rem;
  }
  .goodsDetail-info h1{
    font-size: 0.4rem;
    color: #333333;
  }
  .goodsDetail-info-price{
    display: flex;
    margin: 0.26rem 0;
  }
  .goodsDetail-info-price strong{
    font-size: 0.53rem;
    color: #FF6600;
    margin-right: 0.53rem;
  }
  .goodsDetail-info-price strong em{
    font-size: 0.29rem;
  }
  .goodsDetail-info-price del{
    font-size: 0.34rem;
    color: #999999;
  }
  .goodsDetail-info-spec{
    font-size: 0.32rem;
    color: #999999;
  }
  .goodsDetail-detail{
    margin-top: 0.26rem;
    background-color: #FFFFFF;
  }
  .goodsDetail-detail-title{
    margin: 0 0.4rem;
    border-bottom: 1px solid #EEEEEE;
    line-height: 1.33rem;
    color: #333333;
    font-size:0.4rem ;
  }
  .goodsDetail-btn{
      background-color: #FFFFFF;
      height: 1.41rem;
      position: fixed;
      bottom: 0;
      width: 100%;
      z-index: 9;
  }
  .goodsDetail-btn span{
    display: block;
    background-color: #6DC5C6;
    width: 3.2rem;
    height: 0.88rem;
    line-height: 0.88rem;
    color: #FFFFFF;
    text-align: center;
    border-radius: 0.44rem;
    font-size: 0.37rem;
    margin: 0.26rem auto;
  }
</style>
